<template>
  <div>
    <h1>库存物品</h1>
    <StockTable :stocks="stocks" @mark-usage="handleMarkUsage" />
  </div>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue';
import { fetchStockList, markUsage } from '@/api/stock';
import StockTable from '@/components/StockTable.vue';

const stocks = ref([]);
onMounted(async () => {
  stocks.value = await fetchStockList();
});
function handleMarkUsage(payload: any) {
  markUsage(payload);
}
</script> 